<template>
	<view>
		<cu-page-bg></cu-page-bg>
		<view class="cu-w-100">
			<cu-navbar :title="isInsert ? '新增账本' : '修改'" :placeholder="true" @leftClick="vk.navigateBack()"
				:showLeft="true" :leftIconColor="{color:backgroundStyle.color}"
				:titleStyle="{color:backgroundStyle.color}" :style="getBackgroundStyle"
				bgColor="rgb(255,255,255,0)"></cu-navbar>
			<view class="cu-w-100 cu-p-20 cu-border-box">
				<cu-card :style='{"marginTop" : "40rpx"}'>
					<view>基本信息</view>
					<u--form labelPosition="left" labelWidth="auto" :labelStyle="{paddingRight:'20rpx'}"
						:model="accountBook" ref="uForm">
						<u-form-item label="账本名称" prop="accountBookName" borderBottom>
							<u--input placeholder="请输入账本名称" v-model="accountBook.accountBookName"
								border="none"></u--input>
						</u-form-item>
						<u-form-item label="账本类型" prop="accountType" borderBottom>
							<u-radio-group v-model="accountBook.accountType">
								<u-radio label="个人账本 " name="1"></u-radio>
								<u-radio label="共享账本 " name="2"></u-radio>
							</u-radio-group>
						</u-form-item>
						<u-form-item label="备  注" prop="remarks" borderBottom>
							<u--input placeholder="请输入备注" v-model="accountBook.remarks" border="none"></u--input>
						</u-form-item>
					</u--form>
					<view class="cu-mt-20">
						<u-button :color="buttonColor" @click="submit">确认</u-button>
					</view>
				</cu-card>
			</view>
		</view>
	</view>
</template>

<script>
	let vk = uni.vk;
	export default {
		computed: {
			getBackgroundStyle() {
				let style = {};
				style.background = "linear-gradient(45deg, " + this.main + ", " + this.secondary + ")";
				// 合并用户传递的背景色对象
				Object.assign(style, this.backgroundStyle);
				return style;
			}
		},
		data() {
			return {
				main: vk.getVuex('$app.color.main'),
				secondary: vk.getVuex('$app.color.secondary'),
				buttonColor: "linear-gradient(to right, " + vk.getVuex('$app.color.main') + "," + vk.getVuex(
					'$app.color.secondary') + ")",
				backgroundStyle: {
					color: "#FFF"
				},
				accountBook: undefined,
				isInsert: false,
				errorType: "toast",
				rules: {
					'accountBookName': [{
						type: 'string',
						required: true,
						message: '请填写账本名称',
						trigger: ['blur', 'change']
					}, {
						type: 'string',
						required: true,
						max: 30,
						message: '账本名称不能超过30个字符',
						trigger: ['blur', 'change']
					}],
					'remarks': {
						type: 'string',
						required: false,
						max: 100,
						message: '备注不能超过100个字符',
						trigger: ['blur', 'change']
					}
				},
			};
		},
		onLoad(options) {
			vk = uni.vk;
			this.init(options);
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		},
		methods: {
			// 页面数据初始化函数
			init(options) {
				this.main = vk.getVuex('$app.color.main');
				this.secondary = vk.getVuex('$app.color.secondary');
				this.accountBook = vk.getVuex('$accountbook.accountBook');
				if (this.accountBook == undefined || this.accountBook == '') {
					this.isInsert = true
					this.accountBook = {
						"accountBookName": "",
						"accountType": "1",
						"remarks": ""
					}
				}
				if (this.accountBook && typeof this.accountBook.accountType === 'number') {
				    this.accountBook.accountType = this.accountBook.accountType.toString();
				}
				
			},
			async submit() {
				// 执行注册
				if (this.isInsert) {
					this.insertFun();
				}
				// 执行修改
				else {
					await this.updateFun()
				}
			},
			// 新增
			insertFun() {
				let that = this;
				vk.callFunction({
					url: 'client/accountbook/kh/addAccountBook',
					title: '请求中...',
					data: {
						need_user_info: true, // 注意，need_user_info是加在 data 的属性里，而不是与data同级
						addAccountBook: that.accountBook
					},
					success: (data) => {
						vk.toast("创建成功", "success");
						// 重置账本数据，进行查询
						this.$store.dispatch('$accountbook/clearEnqrData');
						this.navigateBackAndRefresh()
					},
					fail: (err) => {
						const msg = "创建失败-" + err.msg
						vk.alert(msg, "错误提示");
					}
				});
			},
			// 修改
			updateFun() {
				let that = this;
				vk.callFunction({
					url: 'client/accountbook/kh/updateAccountBook',
					title: '请求中...',
					data: {
						need_user_info: true, // 注意，need_user_info是加在 data 的属性里，而不是与data同级
						accountBook: that.accountBook
					},
					success: (data) => {
						vk.toast("修改成功", "success");
						// 重置账本数据，进行查询
						this.$store.dispatch('$accountbook/clearEnqrData');
						this.navigateBackAndRefresh()
					},
					fail: (err) => {
						const msg = "修改失败-" + err.msg
						vk.alert(msg, "错误提示");
					}
				});
			},
			// 当前页的返回逻辑
			navigateBackAndRefresh() {
			  const pages = getCurrentPages(); // 获取页面栈
			  console.log("pages",pages)
			  if (pages.length > 1) {
				const prevPage = pages[pages.length - 2]; // 上一页实例
				if (prevPage.$vm && prevPage.$vm.onRefresh) {
				  prevPage.$vm.onRefresh(); // 调用上一页的刷新方法（需自定义）
				}
				uni.navigateBack({ delta: 1 }); // 返回上一页
			  } else {
				uni.navigateBack();
			  }
			}
		}
	};
</script>

<style lang="scss" scoped>

</style>